<extendheader title="修改密码">
  <button ion-button item-end icon-left class="left" (click)="back()">
    <ion-icon name="ios-arrow-back"></ion-icon>
    返回
  </button>
</extendheader>

<ion-content>
  <div class="modifyPasswordPage">

    <ion-item>
      <ion-label color="primary">当前密码</ion-label>
      <ion-input
        required
        [(ngModel)]="modifyObj.password"
        #password="ngModel"
        placeholder="请输入当前密码"
        (ngModelChange)="txtChange()"
      >
      </ion-input>
    </ion-item>

    <!--<div *ngIf="password.invalid && (password.dirty || password.touched)">-->
    <p style="margin:0;text-align: center;border-bottom:2px solid red; margin-left: 8px;"
       *ngIf="password.invalid && (password.dirty || password.touched)">
      <span *ngIf="password.errors.required">
      <!--当前密码不能为空-->
      </span>
      <span *ngIf="password.errors.minlength">
      <!--当前密码不能小于六位-->
      </span>
    </p>
    <!--</div>-->
    <ion-item>
      <ion-label color="primary">新密码</ion-label>
      <ion-input
        required minlength="6" maxlength="16"
        #newPassword="ngModel"
        placeholder="请输入新密码" [(ngModel)]="modifyObj.newPassword"
        (ngModelChange)="txtChange()"
      >
      </ion-input>
    </ion-item>

    <p style="margin:0;text-align: center;border-bottom:2px solid red; margin-left: 8px;"
       *ngIf="newPassword.invalid && (newPassword.dirty || newPassword.touched)">
      <span *ngIf="newPassword.errors.required">
      <!--新密码不能为空-->
      </span>
      <span *ngIf="newPassword.errors.minlength">
      <!--新密码不能小于六位-->
      </span>
    </p>

    <!--<ion-item>-->
    <!--<ion-label color="primary">确认新密码</ion-label>-->
    <!--<ion-input-->
    <!--required minlength="6" maxlength="16"-->
    <!--#againPassword="ngModel"-->
    <!--(ngModelChange)="txtChange()"-->
    <!--placeholder="请再次输入新密码" [(ngModel)]="modifyObj.againPassword">-->
    <!--</ion-input>-->
    <!--</ion-item>-->

    <ion-item>
      <ion-label color="primary">确认新密码</ion-label>
      <ion-input
        required minlength="6" maxlength="16"
        #againPassword="ngModel"
        placeholder="请再次输入新密码" [(ngModel)]="modifyObj.againPassword"
        (ngModelChange)="txtChange()"
      >
      </ion-input>
    </ion-item>

    <p style="margin:0;text-align: center;border-bottom:2px solid red; margin-left: 8px;"
       *ngIf="againPassword.invalid && (againPassword.dirty || againPassword.touched)">
    <span *ngIf="againPassword.errors.required">
    <!--当前新密码不能为空-->
    </span>
      <span *ngIf="againPassword.errors.minlength">
    <!--当前新密码不能小于六位-->
    </span>
    </p>

    <p style="font-size: 1.5rem">密码长度6～16位</p>

    <button ion-button block [disabled]="disabled" (click)="updatePassWord()">确认提交</button>
  </div>
</ion-content>
